---
type: tutorial
unitTitle: Save time and energy with reusable page layouts
title: 'Check in: Unit 4 - Layouts'
description: >-
  Tutorial: Build your first Astro blog —

  Use Astro layouts to share common elements and styles across your pages and
  posts
i18nReady: true
---
import Badge from '~/components/Badge.astro';
import Box from '~/components/tutorial/Box.astro';
import Checklist from '~/components/Checklist.astro';


Now that you can build with components, it's time to create some custom layouts!

## Looking ahead

In this unit, you'll build layouts to share common elements and styles across your pages and blog posts.

To do this, you will:

- Create reusable layout components
- Pass content to your layouts with `<slot />`
- Pass data from Markdown frontmatter to your layouts
- Nest multiple layouts



<Box icon="check-list">

## Checklist

<Checklist>
- [ ] I am ready to take my page design to the next level with layouts!
</Checklist>
</Box>
